async function getArticle() {
  const res = await GetArticleList()
  console.log(res.data.data)
  $('.layui-card tbody').empty()
  res.data.data.forEach(function (item) {
    let theTr = `<tr>
    <td>${item.name}</td>
    <td>${item.alias}</td>
    <td>
      <button myid="${item.Id}" myname="${item.name}" myalias="${item.alias}" type="button" class="layui-btn layui-btn-xs edit">编辑</button>

      <button myid="${item.Id}" type="button" class="layui-btn layui-btn-xs layui-btn-danger delete">删除</button>
    </td>
  </tr>`
    $('.layui-card tbody').append(theTr)
  })
}
getArticle()
//添加类别
const add_str = `
<form class="layui-form add-form" action="" style="margin: 30px; margin-left: 0px;" id="add_form">
<div class="layui-form-item">
  <label class="layui-form-label">类别名称</label>
  <div class="layui-input-block">
    <input type="text" name="name" required lay-verify="required|ctname" placeholder="请输入标题" autocomplete="off" class="layui-input">
  </div>
</div>
<div class="layui-form-item">
  <label class="layui-form-label">类别别名</label>
  <div class="layui-input-block">
    <input type="text" name="alias" required lay-verify="required|aliname" placeholder="请输入标题" autocomplete="off" class="layui-input">
  </div>
</div>
<div class="layui-form-item">
  <div class="layui-input-block">
    <button class="layui-btn" lay-submit lay-filter="formDemo">确认添加</button>
    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
  </div>
</div>
</form>`
$('.add').on('click', function () {
  const { form } = layui
  form.verify({
    ctname: [/^[\u4E00-\u9FA5]+$/, '分类名只能是中文'],
    aliname: [/^[a-z0-9]+$/, '小写英文和数字组成'],
  })
  const index = layer.open({
    type: 1,
    content: add_str, //这里content是一个普通的String
    title: '新增分类', //标题
    area: ['500px', '300px'],
    success() {
      $('#add_form').on('submit', async function (e) {
        e.preventDefault()
        const obj = {
          name: $('input[name=name]').val(),
          alias: $('input[name=alias]').val(),
        }
        const res = await PostAddCategory(obj)
        console.log(res)
        if (res.data.status === 0) {
          $('input[name=name]').val(''), $('input[name=alias]').val('')
        }
        getArticle()
        layer.close(index)
      })
    },
  })
})
//删除类别
$('.layui-table tbody').on('click', '.delete', async function () {
  console.log($(this).attr('myid'))
  const res = await GetDeleteClassify($(this).attr('myid'))
  console.log(res)
  getArticle()
})
//编辑类别
const edit_str = `
  <form class="layui-form add-form" action="" style="margin: 30px; margin-left: 0px;" id="edit_form" lay-filter="edit">
    <div class="layui-form-item">
      <label class="layui-form-label">类别名称</label>
      <div class="layui-input-block">
        <input type="text" name="name" required lay-verify="required|ctname" placeholder="请输入标题" autocomplete="off" class="layui-input">
      </div>
    </div>
    <div class="layui-form-item">
      <label class="layui-form-label">类别别名</label>
      <div class="layui-input-block">
        <input type="text" name="alias" required lay-verify="required|aliname" placeholder="请输入标题" autocomplete="off" class="layui-input">
      </div>
    </div>
    <input type="hidden" name="Id">
    <div class="layui-form-item">
      <div class="layui-input-block">
        <button class="layui-btn" lay-submit >确认修改</button>
      </div>
    </div>
  </form>`
$('.layui-table tbody').on('click', '.edit', function () {
  console.log('----')
  let index = layer.open({
    type: 1,
    content: edit_str, //这里content是一个普通的String
    title: '修改分类', //标题
    area: ['500px', '300px'],
    success: () => {
      console.log($(this))
      $('input[name=name]').val($(this).attr('myname'))
      $('input[name=alias]').val($(this).attr('myalias'))
      $('input[name=Id]').val($(this).attr('myid'))
      $('#edit_form').on('submit', async (e) => {
        console.log($(this).attr('myid'))
        e.preventDefault()
        const obj = {
          name: $('input[name=name]').val(),
          alias: $('input[name=alias]').val(),
          Id: $('input[name=Id]').val(),
        }
        const res = await PostReviseClassify(obj)
        console.log(res)
        layer.close(index)
        getArticle()
      })
    },
  })
})
